<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
	<script src="../node_modules/axios/dist/axios.js"></script>
</head>
<body>
	<button>发送请求</button>
</body>
<script type="module">
	// 1- 拦截器可以设置多个，请求拦截先声明的的后执行，响应拦截先声明的先执行。
	// 2- 拦截器可以指定两个回调函数（成功回调，失败回调）
	// 3- 拦截器是可以取消的。
	// 请求拦截返回的值才是最终的配置对象。
	// [
	//      请求拦截2成功,请求拦截2失败，
	//      请求拦截1成功,请求拦截1失败，
	//      发送ajax请求的函数,undefined,
	//      响应拦截1成功,响应拦截1失败，
	//      响应拦截2成功,响应拦截2失败，
	// ]
	// Promise.resolve(config)
	//  .then( 请求拦截2成功,请求拦截2失败)
	//  .then( 请求拦截1成功,请求拦截1失败)
	//  .then( 发送ajax请求的函数,undefined)
	//  .then( 响应拦截1成功,响应拦截1失败)
	//  .then( 响应拦截2成功,响应拦截2失败)
	//
	
	const r1 = axios.interceptors.request.use(function(config){
		console.log("请求拦截1-成功回调",config);
		return config;
	},()=>{
		console.log("请求拦截1-失败回调")
	})
	const r2 = axios.interceptors.request.use(function(config){
		console.log("请求拦截2-成功回调")
		// throw "异常"
		return config;
	},()=>{
		console.log("请求拦截2-失败回调")
	})
	// 响应拦截返回的值是最终获取到的值。
	const s1= axios.interceptors.response.use(function(res){
		console.log("响应拦截1-成功回调")
		return res.data;
	},(err)=>{
		console.log("响应拦截1-失败回调",err)
	})
	const s2 = axios.interceptors.response.use(function(res){
		console.log("响应拦截2-成功回调")
		return res.data;
	},()=>{
		console.log("响应拦截2-失败回调")
	})
	console.log(r1,r2,s1,s2);
	// axios.interceptors.request.eject(r1);
	// axios.interceptors.request.eject(r2);
	// axios.interceptors.response.eject(s1);
	// axios.interceptors.response.eject(s2);
	axios.interceptors.request.clear();// 移除所有的请求拦截
	axios.interceptors.response.clear();// 移除所有的响应拦截
	document.querySelector("button").onclick = function(){
		axios.get("http://zhangpeiyue.com/scoreList").then(value=>{
			console.log(value);
		})
	}
</script>
</html>